<template>
	<div>
        <video id="myPlayer" poster=""
        :src="url" autoplay
        :style="{width:'100%',height:height}">
            <source :src="url" type="rtmp/flv" />
        </video>
	</div>
</template>
<script>
//rtmp://rtmp01open.ys7.com/openlive/5b0ad028b45a40b398684774274cd362.hd
import "video.js/dist/video-js.css";
import { videoPlayer } from "vue-video-player";
import "videojs-flash";

setTimeout(function() {
  var player = new EZUIPlayer("myPlayer");
}, 3000);
// setTimeout(function() {
//     var v = document.getElementById("myPlayerflashId");
//     console.log('myPlayerflashId',v);
//     if(v==null){
//         window.location.reload();
//     }
// },5000);
export default {
  components: {
    videoPlayer
  },
  //props:['height','url'],
  props: {
    height: {
      type: String,
      default: "420px"
    },
    url: {
      type: String,
      default: ""
    }
  },
  data() {
    console.log('this.url',this.url);
    var height = this.height;
    return {
      playerOptions: {
        height: height,
        sources: [
          {
            type: "rtmp/mp4",
            src:
              "rtmp://rtmp01open.ys7.com/openlive/5b0ad028b45a40b398684774274cd362" //rtmp://127.0.0.1:8080/test/test
          }
        ],
        techOrder: ["flash"],
        autoplay: true,
        controls: true
      }
    };
  }
};
</script>